import React from 'react';
import { ChildBenchMarkC, PrimaryC, FirstHeaderC, SecondHeaderC } from '../../../components';
import { Form } from 'antd';

class ChildBenchMarkDemo extends React.Component {
  constructor(props) {
    super(props);
    this.formRef = React.createRef();
    this.state = {
      init2: '801130.999',
      init3: undefined,
      init4: '002091.SZ',
      keyFlag: false, // 查询时 自定义基准61399e0041999f5cf214f086 id ==>true 还是普通的002091.SZ false
    };

    setTimeout(() => {
      this.setState({
        init3: '300025.SZ',
      });
    }, 3000);
  }

  onClick2 = () => {
    this.state.BenchMarkC2.setSelect('H11007.CSI');
  };

  onClick3 = () => {
    this.state.BenchMarkC3.setSelect('H11007.CSI');
  };

  onClick4 = () => {
    this.setState(
      {
        keyFlag: true,
      },
      () => {
        this.state.BenchMarkC4.setSelect('61399e0041999f5cf214f086');
      },
    );
  };

  render() {
    return (
      <div style={{ padding: '20px' }}>
        <Form ref={this.formRef}>
          <FirstHeaderC title='基本用法' />
          <div style={{ width: '500px' }}>
            <SecondHeaderC title='无初始化值' />
            <ChildBenchMarkC rules={[{ required: true, message: `请输入` }]} form={this.formRef.current} dataIndex='bench1' onChange={(e) => console.log(e)} />
            <SecondHeaderC title='有初始化值-同步' />
            <ChildBenchMarkC
              form={this.formRef.current}
              dataIndex='bench2'
              initialValue={this.state.init2}
              onRef={(ref) => this.setState({ BenchMarkC2: ref })}
              onChange={(e) => console.log(e)}
            />
            <PrimaryC onClick={this.onClick2} title='修改' />
            <SecondHeaderC title='有初始化值-异步' />
            <ChildBenchMarkC
              form={this.formRef.current}
              dataIndex='bench3'
              initialValue={this.state.init3}
              onChange={(e) => console.log(e)}
              onRef={(ref) => this.setState({ BenchMarkC3: ref })}
            />
            <PrimaryC onClick={this.onClick3} title='修改' />
            <SecondHeaderC title='包含自定义子基准' />
            <ChildBenchMarkC
              form={this.formRef.current}
              dataIndex='bench4'
              includeBench={1}
              keyFlag={this.state.keyFlag}
              initialValue={this.state.init4}
              onChange={(e) => console.log(e)}
              onRef={(ref) => this.setState({ BenchMarkC4: ref })}
            />
            <PrimaryC onClick={this.onClick4} title='修改为自定义id' />

            <SecondHeaderC title='设置校验规则' />
            <ChildBenchMarkC form={this.formRef.current} dataIndex='bench5' rules={[{ required: true, message: '请选择基准!' }]} onChange={(e) => console.log(e)} />
            <SecondHeaderC title='设置帮助信息' />
            <ChildBenchMarkC form={this.formRef.current} dataIndex='bench6' helper='lalal' onChange={(e) => console.log(e)} />
            <SecondHeaderC title='禁用' />
            <ChildBenchMarkC form={this.formRef.current} dataIndex='bench7' disabled={true} onChange={(e) => console.log(e)} />
          </div>
        </Form>
      </div>
    );
  }
}

export default ChildBenchMarkDemo;
